Expo 46 Invariant Violation: ViewPropTypes has been removed from React Native.
You have just upgraded to Expo 46 and get the error:
Invariant Violation: ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'., js engine: hermes
This error occurs when code (likely a third party package) tries to use depreciated ViewPropTypes.
Back in 2018 the react native team started to remove PropTypes from React Native. Last year, in 0.68 the react native team introduced a deprecation warning which notified users that the change is coming.
Warning: ViewPropTypes will be removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'.In React Native 0.69 (included in Expo SDK 46) they removed the PropTypes entirely.
Recommended Fix
The recommended fix is to switch from PropTypes to a type system like TypeScript. If you need to continue using PropTypes, the fix is to find the code that is using PropTypes and switch the import from:
import { ViewPropTypes } from 'react-native';
to:
import { ViewPropTypes } from 'deprecated-react-native-prop-types';
Sometimes, a library you depend on may be using the PropTypes. In that case, it’s recommended to submit an issue or PR to the library and/or update to the latest version. In extreme cases (like the library you’re using is unmaintained) you may need to fork the library, or use patch-package for that library itself to replace the types until it’s fixed upstream.
In my case one of the packages responsible for this error was
react-native-snap-carousel
Which at the time of publishing has not been maintained for 2 years
How to use patch-package?
Step 1. Set-up
Edit your package.json to include the line: “postinstall”: “patch-package”
"scripts": {
…other scripts,
"postinstall": "patch-package"
}
Step 2. Install patch-package and postinstall-postinstall
Run command
yarn add patch-package postinstall-postinstall deprecated-react-native-prop-types
Or npm whichever package manager you use.
Step 3. Modify code of library within node_modules folder
For example change:
import { ViewPropTypes } from 'react-native';
to:
import { ViewPropTypes } from 'deprecated-react-native-prop-types';
Step 4. Patch the package
yarn patch-package package-name
For example yarn patch-package:
yarn patch-package react-native-snap-carousel
Now each time you run yarn install … anything, the post-post install script will modify the package with your changes.